<!doctype html>
<html>

    <head>
        <title>test page for Math.atan2....does IE report different values to other browsers?</title>
        <!-- the answer would appear to be no.  they are all the same -->
    </head>

    <body>

    <div id="one" style="position:absolute;left:10px;top:10px;width:3em;height:3em;border: 1px solid red">one</div>
    <div id="two" style="position:absolute;left:220px;top:10px;width:3em;height:3em;border: 1px solid red">two</div>
    <div id="three" style="position:absolute;left:10px;top:220px;width:3em;height:3em;border: 1px solid red">three</div>
    <div id="four" style="position:absolute;left:220px;top:220px;width:3em;height:3em;border: 1px solid red">four</div>
    <div id="five" style="position:absolute;left:110px;top:110px;width:3em;height:3em;border: 1px solid red">five</div>

    <div id="info" style="margin-left:300px;"></div>

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script type="text/javascript" src="../../js/lib/jquery-ui-1.8.13-min.js"></script>

    <!-- support lib for bezier stuff -->
    <script type="text/javascript" src="../../js/lib/jsBezier-0.3-min.js"></script>
    <!-- main jsplumb engine -->
    <script type="text/javascript" src="../../js/1.3.4/jsPlumb-1.3.4-RC1.js"></script>
    <!-- connectors, endpoint and overlays  -->
    <script type="text/javascript" src="../../js/1.3.4/jsPlumb-defaults-1.3.4-RC1.js"></script>
    <!-- state machine connectors -->
    <script type="text/javascript" src="../../js/1.3.4/jsPlumb-connectors-statemachine-1.3.4-RC1.js"></script>
    <!-- SVG renderer -->
    <script type="text/javascript" src="../../js/1.3.4/jsPlumb-renderers-svg-1.3.4-RC1.js"></script>
    <!-- canvas renderer -->
    <script type="text/javascript" src="../../js/1.3.4/jsPlumb-renderers-canvas-1.3.4-RC1.js"></script>
    <!-- vml renderer -->
    <script type="text/javascript" src="../../js/1.3.4/jsPlumb-renderers-vml-1.3.4-RC1.js"></script>
    <!-- jquery jsPlumb adapter -->
    <script type="text/javascript" src="../../js/1.3.4/jquery.jsPlumb-1.3.4-RC1.js"></script>

        <script type="text/javascript">

            $(function() {
               var _d = function(elId) {
                   var o = $("#" + elId).offset(), w = $("#" + elId).outerWidth(), h = $("#" + elId).outerHeight(),
                        c = [(o.left + w) / 2, (o.top + h) / 2 ];

                   return c;
               },
               _a = function(e1, e2, t, t2) {

                   return "<br />" + e1 + " - " + e2 + " : " + t + ", " + t2;
               },
               _o = function(e1, e2) {
                    var c1 = _d(e1), c2 = _d(e2),
                    theta = Math.atan2((c2[1] - c1[1]) , (c2[0] - c1[0])),
		            theta2 = Math.atan2((c1[1] - c2[1]) , (c1[0] - c2[0]));

                   return _a(e1, e2, theta, theta2);
               };

                var t = "";

                t += _o("five", "one");
                t += _o("five", "two");
                t += _o("five", "three");
                t += _o("five", "four");

                $("#info").html(t);

            });

        </script>

    </body>

</html>